// import Blockly from 'blockly'

export const useBlockEditor = (Blockly: any ) => {
  const setCustomTheme = () => {
    Blockly.Themes.CUSTOM_THEME = Blockly.Themes.defineTheme('CUSTOM_THEME', {
      base: Blockly.Themes.Classic,
      categoryStyles: {
        custom_category: {
          colour: '#5ba5a5', // 工具箱颜色标识
        },
      },
      blockStyles: {
        // 块样式目前由四个字段组成：colourPrimary、colourSecondary、colorTertiary 和 hat。
        custom_text_blocks: {
          colourPrimary: '#5ba5a5', //块的背景色，可以用色调或十六进制值定义
          colourSecondary: '#5ba5a5', // 如果块是阴影块，则使用此颜色
          colourTertiary: '#C5EAFF', // 块的边框颜色
        },
      },
      componentStyles: {
        workspaceBackgroundColour: '#131313', // 工作区背景色
        toolboxBackgroundColour: '#2f2e2b', // 工具箱背景色
        toolboxForegroundColour: '#f5f5f5', // 工具箱类别文字颜色
        flyoutBackgroundColour: '#252526', // 弹出背景颜色
        flyoutForegroundColour: '#333', // 弹出标签文本颜色
        flyoutOpacity: 1, // 弹出不透明度
        scrollbarColour: '#dcdcdc', // 滚动条颜色
        scrollbarOpacity: 0.4, // 滚动条不透明度
        insertionMarkerColour: '#f5f5f5', // 插入标记颜色（不接受颜色名称）
        insertionMarkerOpacity: 0.3, // 插入标记不透明度
        cursorColour: '#f5f5f5', // 键盘导航模式下显示的光标颜色
      },
    })
  }
  return {
    setCustomTheme
  }
}
